/**
 * Created by zhouming on 2018/11/4.
 */
import React from 'react';
import style from './css/app.css'
import {BombUtils} from "../utils/BombUtils";
import {GlobalObj} from  '../utils/GlobalObj'
import {Link} from 'react-router-dom'

export class App extends React.Component{
    constructor(){
        super();
        this.state = {
            mathList:[],
            englishList:[],
            writeList:[],
            logicList:[]
        }
    }

    render(){
        return (
            this._renderContent()
        )
    }

    getDataText = (datas)=>{
        return datas.list ? '('+datas.list.length+')':'(暂无数据)'
    };

    jumpLimit = (datas,path)=>{
        return datas.list ? datas.list.length>0?path:'':''
    };

    _renderContent(){
        const {content,part,single,text,smallText} = style;
        const {mathList,englishList,logicList,writeList} = this.state;
        return (
            <div className={content}>
                <div className={part}>
                    <Link to={this.jumpLimit(mathList,"/courseList")} className={single} style={{background:'#de4641'}} onClick={()=>{GlobalObj.jumpType = GlobalObj.type.math}}>
                            <p className={text} style={{color:'white'}}>数学</p>
                            <p className={smallText} style={{color:'white'}}>{this.getDataText(mathList)}</p>
                    </Link>
                    <Link to={this.jumpLimit(englishList,"/courseList")} className={single} style={{background:'white'}} onClick={()=>{GlobalObj.jumpType = GlobalObj.type.english}}>
                        <p className={text} style={{color:'black'}}>英语</p>
                        <p className={smallText} style={{color:'black'}}>{this.getDataText(englishList)}</p>
                    </Link>
                </div>
                <div className={part}>
                    <Link to={this.jumpLimit(writeList,"/courseList")} className={single} style={{background:'white'}} onClick={()=>{GlobalObj.jumpType = GlobalObj.type.write}}>
                        <p className={text} style={{color:'black'}}>写作</p>
                        <p className={smallText}style={{color:'black'}}>{this.getDataText(writeList)}</p>
                    </Link>
                    <Link to={this.jumpLimit(logicList,"/courseList")} className={single} style={{background:'#5b5c5c'}} onClick={()=>{GlobalObj.jumpType = GlobalObj.type.logic}}>
                        <p className={text} style={{color:'white'}}>逻辑</p>
                        <p className={smallText} style={{color:'white'}}>{this.getDataText(logicList)}</p>
                    </Link>
                </div>
            </div>
        );
    }

    /**
     * @desc 初始化信息
     * */
    initInfo = async()=>{
        if(!GlobalObj.appListIsLoad || GlobalObj.appListData.length==0){
            BombUtils.init();
            const datas = [{courseType:'数学'},{courseType:'英语'},{courseType:'写作'},{courseType:'逻辑'}];
            let result = await BombUtils.findAllDatas(datas);
            this.setState({
                mathList:result[0],
                englishList:result[1],
                writeList:result[2],
                logicList:result[3]
            });
            GlobalObj.appListIsLoad = true;
            GlobalObj.appListData = result;
            console.log('第一次加载')
        }else{
            let result = GlobalObj.appListData;
            this.setState({
                mathList:result[0],
                englishList:result[1],
                writeList:result[2],
                logicList:result[3]
            });
            console.log('加载过了')
        }
    }



    componentDidMount(){
        this.initInfo();
    }
}
